import type { ReactElement } from 'react';
import React, { useState } from 'react';
import { Modal, Button } from 'antd';
import OperpQuery from './OperpQuery';
import type { SearchConfig } from '@ant-design/pro-table/lib/components/Form/FormRender';
import type { ButtonType } from 'antd/lib/button';

export interface FCProps {
  btntype?: ButtonType;
  setCurrent?: (item: any) => void;
  danger?: boolean;
  text: string | ReactElement;
  title: string | ReactElement;
  search?: false | SearchConfig;
  icon?: any;
  disabled?: any;
  toolBarRender?: any | false;
  rowSelection?: any;
  scroll?: any;
  width: number;
  sysReportName: string;
  params?: any;
}
const QuerySelect: React.FC<FCProps> = (props: FCProps) => {
  const [visible, switchModal] = useState<any>(false);
  const setCurrent = (obj?: any) => {
    if (props.setCurrent) {
      props.setCurrent(obj);
    }
    switchModal(false);
  };
  return (
    <>
      <Button
        type={props.btntype}
        danger={props.danger}
        icon={props.icon}
        disabled={props.disabled}
        onClick={() => switchModal(true)}
      >
        {props.text}
      </Button>
      <Modal
        width={props.width}
        title={props.title}
        visible={visible}
        destroyOnClose={true}
        onCancel={() => switchModal(false)}
        footer={false}
      >
        <OperpQuery
          sysReportName={props.sysReportName}
          scroll={props.scroll}
          search={props.search}
          rowSelection={props.rowSelection}
          callback={setCurrent}
          params={props.params}
          toolBarRender={props.toolBarRender}
        />
      </Modal>
    </>
  );
};
export default QuerySelect;
